<template>
  <view class="view-class">
    <u-navbar back-text="返回" title="匿名投诉"></u-navbar>
    <view class="view-box">
      <u-form :model="form" ref="uForm" label-width="140" label-align="center">
        <u-form-item required label="被投诉人姓名" prop="reportName"><u-input  v-model="form.reportName" :disabled="isSuccess"/></u-form-item>
        <u-form-item required label="被投诉人床位号" prop="badNumber"><u-input v-model="form.badNumber" :disabled="isSuccess" /></u-form-item>
        <u-form-item required label="投诉类型" prop="type"><u-input type="select" v-model="form.type1" @click="selectFunc()"  :disabled="isSuccess"/></u-form-item>
        <u-form-item  label="备注" prop="notes"><u-input v-model="form.notes" :disabled="isSuccess" /></u-form-item>
<!--        <u-form-item required label="实际退宿日期" prop="checkOutTime">-->
<!--          <u-input v-model="form.realityCheckOutTime" type="select" @click="checkOutTimeFunc"/>-->
<!--        </u-form-item>-->
      </u-form>
      <u-button style="position: fixed;bottom: 0;left: 0;width: 100%;z-index: 9" type="primary" @click="submitFunc" v-if="!isSuccess">提交</u-button>
      <u-button style="position: fixed;bottom: 0;left: 0;width: 100%;z-index: 9" type="primary" @click="submitFunc('success')" v-else>完成</u-button>
    </view>
    <u-select v-model="showContactRelationSel" :list="complaintList" mode="single-column"
              @confirm="selectedContactRelation"></u-select>
<!--    <u-calendar v-model="calendarShow" :mode="mode" :default-start-date="minDate" :min-date="minDate" :max-date="'2099-1-1'" @change="changeCalendar"></u-calendar>-->
    <u-top-tips ref="uTips"></u-top-tips>
    <u-modal v-model="show" confirm-text="退出"
             title="提示"  @confirm="submitFunc('success')"
    >
      <view class="u-update-content">
        <rich-text style="text-align: center;padding: 30rpx" :nodes="content"></rich-text>
      </view>
    </u-modal>
  </view>
</template>

<script>
import {compressImg} from '@/utils/compressor/compress.js'
import {uploadImg} from '@/utils/upload.js'
import {isEmpty} from "@/utils";
import * as consts from "@/utils/constant.js";
// import uniRate from '@/uni_modules/uni-rate/'
export default {
  data() {
    return {
      show:false,
      content:'未查询到您的住宿信息，暂时无法申请打扫',
      rules:{
        ridersName: [{required: true,message: '请输入/选择相关内容',trigger: ['change','blur'],}],
        building: [{required: true,message: '请输入/选择相关内容',trigger: ['change','blur'],}],
        roomId: [{required: true,message: '请输入/选择相关内容',trigger: ['change','blur'],}],
        ridersPhone: [{
          required: true,
          message: '请输入手机号',
          trigger: ['change','blur'],
        },
          {
            // 自定义验证函数，见上说明
            validator: (rule, value, callback) => {
              // 上面有说，返回true表示校验通过，返回false表示不通过
              // this.$u.test.mobile()就是返回true或者false的
              return this.$u.test.mobile(value);
            },
            message: '手机号码不正确',
            // 触发器可以同时用blur和change
            trigger: ['change','blur'],
        }]
      },
      riderRoster:uni.getStorageSync("riderRoster"),
      form: {},
      radio: '',
      switchVal: false,
      showbedImages:false,
      showIdCardBadgeImages:false,
      showIdCardPortraitImgPreview:false,
      idCardPopup:true,
      idCardForm:{},
      isCRM:false,
      calendarShow:false,
      mode: 'date',
      //同行人员相关
      // 关系列表
      complaintList: [],
      showContactRelationSel:false,
      tzryPopup:false,
      tzryForm:{},
      isSuccess:false,
      dormitoryId:'',

    };
  },
  async onLoad() {
    let openId = uni.getStorageSync('openId')
    let res3 = await this.$api.dormitory.getLodgingInfo(openId)
    let data = res3.data

    if (isEmpty(data)) {
      this.show = true
      this.content = '您暂时不属于住宿人员，无法进行匿名投诉！'
      return
    }

    

    this.form.dormitoryId	= data.id
    this.form.ridersId = data.riderId
    this.form.ridersName = data.name
    // this.form.ridersPhone = data.phoneNumber
    // this.form.building = data.buildingNo
    // this.form.roomId = data.roomNo

    this.dormitoryId = data.id 
    let res = await this.$api.dormitory.getdictType('nmjb_tsxx_type');
    if (res.data) {
      res.data.forEach(item => {
        this.complaintList.push({ value: item.dictValue, label: item.dictLabel })
      })
    }
    this.$nextTick(()=>{
      this.$refs.uForm.setRules(this.rules)
    })
  },
  methods:{
    selectFunc(){
      if (this.isSuccess) {
          return
      }
      this.showContactRelationSel = true
    },
    jointUrl(url) {
      // return (window.location.href.includes('/xsdcrm-wechat-ui/')?consts.API_BASE_URL+'/xsdcrm-static/upload/': '/profile/')
      return (window.location.href.includes('/xsdcrm-wechat-ui/')?consts.API_BASE_URL+'/xsdcrm-static/upload/': '/profile/') + url
    },
    selectedContactRelation(e){
      console.log(e)
      this.form.type = e[0].value
      this.form.type1 = e[0].label
    },
    async submitFunc(type) {
      if (type == 'success') {
        uni.reLaunch({
          url: `/pages/HomePage/webIndex`
        })
        return
      }
      this.$refs.uForm.validate(async (valid) => {
        if (valid) {
          uni.showLoading({
            title: '申请中'
          });
            this.form.ridersId = this.form.ridersId?this.form.ridersId:this.riderRoster.ridersId
            const {code,msg,data} = await this.$api.dormitory.ridersCleaningReport(this.form).catch((e)=>{
              uni.hideLoading();
            })
            if (code == 200) {
              // uni.showToast({
              //   title: '举报已提交',
              //   icon: "none",
              // });
              this.show = true
              this.content = '举报已提交'
              this.isSuccess = true
              uni.hideLoading();
            }
        } else {
          console.log('验证失败');
        }
      });
    },
  }
};
</script>
<style scoped>
*{
  box-sizing: border-box;
}
  .view-class{
    width: 100%;
    height: 100vh;
  }
  .view-box{
    padding:0 30rpx;
    padding-bottom: 120rpx;
  }
  .container {
    height: 200vh;
    margin-top: 150rpx;
  }

  .sticky {
    width: 750rpx;
    height: 120rpx;
    background-color: #2979ff;
    color: #fff;
    padding: 24rpx;
  }
  .u-form-item{
    padding-right: 30rpx;
  }

  /deep/.u-star-wrap{
    line-height: 1;
  }
</style>
